var images = {};
// Add in prepareCanvas Function
loadImage("leftArm");
loadImage("legs");
loadImage("torso");
loadImage("rightArm");
loadImage("head");
loadImage("hair");
loadImage("leftArm-jump");
loadImage("legs-jump");
loadImage("rightArm-jump");

var totalResources = 9;
var numResourcesLoaded = 0;
var fps = 30;

var charX = 245;
var charY = 185;

var breathInc = 0.1;
var breathDir = 1;
var breathAmt = 0;
var breathMax = 2;
var breathInterval = setInterval(updateBreath, 1000 / fps);

var maxEyeHeight = 14;
var curEyeHeight = maxEyeHeight;
var eyeOpenTime = 0;
var timeBtwBlinks = 4000;
var blinkUpdateTime = 200;
var blinkTimer = setInterval(updateBlink, blinkUpdateTime);
jumping = false;

function prepareCanvas(canvasDiv, canvasWidth, canvasHeight) {
// Create the canvas (Neccessary for IE because it doesn't know what a canvas element is)
canvas = document.createElement('canvas');
canvas.setAttribute('width', canvasWidth);
canvas.setAttribute('height', canvasHeight);
canvas.setAttribute('id', 'canvas');
canvasDiv.appendChild(canvas);
if(typeof G_vmlCanvasManager != 'undefined') {
canvas = G_vmlCanvasManager.initElement(canvas);
}
context = document.getElementById('canvas').getContext("2d");
//loadImage here
}

function loadImage(name)
{
images[name] = new Image();
images[name].onload = function() 
	{
	resourceLoaded();
	}
images[name].src = "images/" + name + ".png";
}


function resourceLoaded()
{
numResourcesLoaded += 1;
if(numResourcesLoaded === totalResources) 
		{ 
			setInterval(redraw, 1000 / fps);
		}
}

function redraw() {
var x = charX;
var y = charY;
var jumpHeight = 45;

canvas.width = canvas.width; // clears the canvas
// Draw shadow
if (jumping) {
drawEllipse(x + 40, y + 29, 100 - breathAmt, 4);
} else {
drawEllipse(x + 40, y + 29, 160 - breathAmt, 6);
}
if (jumping) {
y -= jumpHeight;
}
if (jumping) {
context.drawImage(images["leftArm-jump"], x + 40, y - 42 - breathAmt);
} else {
context.drawImage(images["leftArm"], x + 40, y - 42 - breathAmt);
}
if (jumping) {
context.drawImage(images["legs-jump"], x, y- 6);
} else {
context.drawImage(images["legs"], x, y);
}
context.drawImage(images["torso"], x, y - 50);
context.drawImage(images["head"], x - 10, y - 125 - breathAmt);
context.drawImage(images["hair"], x - 37, y - 138 - breathAmt);
if (jumping) {
context.drawImage(images["rightArm-jump"], x - 35, y - 42 - breathAmt);
} else {
context.drawImage(images["rightArm"], x - 15, y - 42 - breathAmt);
}
drawEllipse(x + 47, y - 68 - breathAmt, 8, curEyeHeight);
drawEllipse(x + 58, y - 68 - breathAmt, 8, curEyeHeight);
}

function drawEllipse(centerX, centerY, width, height) {
context.beginPath();
context.moveTo(centerX, centerY - height/2);
context.bezierCurveTo(
centerX + width/2, centerY - height/2,
centerX + width/2, centerY + height/2,
centerX, centerY + height/2
);
context.bezierCurveTo(
centerX - width/2,
centerY + height/2,
centerX - width/2,
centerY - height/2, centerX, centerY - height/2
);
context.fillStyle = "black";
context.fill(); context.closePath();
}

function updateBreath() {
if (breathDir === 1) { // breath in
breathAmt -= breathInc;
if (breathAmt < -breathMax) {
breathDir = -1;
}
} else { // breath out
breathAmt += breathInc;
if(breathAmt > breathMax) {
breathDir = 1;
}
}
}

function updateBlink() {
eyeOpenTime += blinkUpdateTime;
if(eyeOpenTime >= timeBtwBlinks){
blink();
}
}
function blink() {
curEyeHeight -= 1;
if (curEyeHeight <= 0) {
eyeOpenTime = 0; curEyeHeight = maxEyeHeight;
} else {
setTimeout(blink, 10);
}
}
function jump() {
if (!jumping) {
jumping = true;
setTimeout(land, 500);
}
}
function land() {
jumping = false;
}